<!--Home page avialable to all who visit site-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Home - Comics.US</title>
<link rel="stylesheet" href="../template.css" type="text/css" />  <!-- choose the css template -->

</head>
<body>
<div id="outer_container">
  <div id="inner_container">
    <div id="header_wrapper">

	  
      {% if logged_in %}<!--Display usernamed if logged in and ability to log out-->
      <div id="login">
		Welcome {{username}}&nbsp &nbsp
        <form id="form1" name="form1" method="post" action="accounts/logout"><!--If not logged in show ability to register-->
           Not you?<label> <a href="accounts/logout"> <!-- <laber> --> 
            <input type="submit" name="logout" id="button" value="Log Out" width="15px" /></a>
          </label>
        </form>
      </div>  
	  {% endif %}
	  {% if not logged_in %}
      <div id="login">
        <form id="form1" name="form1" method="post" action="accounts/login">
          <label>ID:
            <input type="text" name="username" id="username" width="60px" />
          </label>
          <label>Password
            <input type="password" name="password" id="password" width="60px" />
          </label>
          <label>
            <input type="submit" name="login" id="button" value="Login" width="15px"/>
          </label>
        </form>
		<label> <a href="registration">
			<input type="submit" name="register" id="button" value="Register" width="15px" /></a>
        </label>
      </div>  

	  {% endif %}
    </div>
    <div id="navigator_container"><!--Links at top of page-->
    
      <div id="navigator"><a href="home" id="gl1" class="glink"> Home  |   </a><a href="list/comics/1" id="gl2" class="glink" onmouseover="ehandler(event,menuitem2);"> Comics  |   </a><a href="list/fiction/1" id="gl3" class="glink" onmouseover="ehandler(event,menuitem3);"> Fictions  |   </a><a href="list/gallery/1" id="gl4" class="glink" onmouseover="ehandler(event,menuitem3);"> Gallery  |   </a><a href="list/clan/1" id="gl5" class="glink" onmouseover="ehandler(event,menuitem3);"> Clans  |   </a><a href="list/people/1" id="gl7" class="glink" onmouseover="ehandler(event,menuitem3);"> People  |   </a>{% if logged_in %}<a href="profile/{{username}}" id="gl6" class="glink" onmouseover="ehandler(event,menuitem3);"> Profile </a>{% endif %}</div>
      <div id="search_container"><!--Search area-->
        <form id="form2" name="form2" method="post" action="list/search/1">
          <label>
            <input type="text" name="searchTerm" id="textfield3" />
          </label>
                     <label>
             <input type="submit" name="button" id="button" value="Search" width="15px" />
          </label>
        </form>
      </div>
    </div>

    <div id="doc2">
    <div id="main_area_homepage">
      <div id="ranking_in_homepage">
        <div id="comics_rank">
		  <div id="comics_rank_banner">
		  </div>
          <!--<p><u>Top Comics</u>
          </p>-->
		  {% for f in topcomics %}<!--Display top comics, fictions, and users based on rating-->
          <p> <a href="comics/{{f.title}}"><strong> &nbsp {{f.title}}</strong></a><br> &nbsp <strong>By</strong> <a href="profile/{{f.of.username}}"> {{f.of.username}}</a>  <strong>Score -</strong> {{f.vote}}</p>
          {% endfor %}
        </div>
        <div id="illustration_rank">
		   <div id="illustration_rank_banner"></div>
		 <!--<p><u>Top Illustrations</u>
          </p>-->
			{% for f in topill %}
			<p> <a href="illustration/{{f.title}}"><strong> &nbsp {{f.title}}</strong></a><br> &nbsp <strong>By</strong> <a href="profile/{{f.of.username}}"> {{f.of.username}}</a>  <strong>Score -</strong> {{f.vote}}</p>
           {% endfor %}
        </div>
        <div id="fiction_rank">
             <div id="fiction_rank_banner"></div>
		  <!--  <p><u>Top Fictions</u>
          </p>-->
		  {% for f in topfictions %}
          <p> <a href="fiction/{{f.title}}"><strong> &nbsp {{f.title}}</strong></a><br> &nbsp <strong>By</strong> <a href="profile/{{f.of.username}}"> {{f.of.username}}</a>  <strong>Score -</strong> {{f.vote}}</p> <!-- output the top 3 fictions -->
          {% endfor %}
        </div>
        <div id="active_user_rank">
            <div id="active_user_rank_banner"></div>
		   <!--<p><u>Top Users</u>
          </p>-->
		  {% for f in users %}
          <p> <a href="profile/{{f.on}}"> &nbsp <strong>{{f.on}}</strong><br> &nbsp Rating-{{f.score}} </a></p> <!-- output the top 3 user -->
          {% endfor %}
        </div>
         
      </div>
    <div id="maincontent_in_homepage"> 
        <div id="comics_fiction_illustration">
          <div id="new_comics_and_fiction"> <!-- display the newly added artwork-->
            <div id="new_comics" style="height:260px"><div id="new_comics_banner"></div>
			{% for f in newcomics %}
			<div id="single_clan_listing_pic" style="width:180px">
				<a href="../../comics/{{f.title}}"> <img alt="" height="95" src="../{{f.path}}" width="126" /></a><br><strong>Title-</strong> {{f.title}} <strong>By-</strong><a href="../../profile/{{f.of.username}}">{{f.of.username}}</a>
				</div>
			<div id="single_clan_listing_text" style="width:250px">
			<strong>Abstract-</strong> {{f.abstract}}<br />
			</div>
			<br><br><br><br><br><br><br>
			{% endfor %}
            </div>
            <div id="new_fiction" style="background:white; height:220px"><div id="new_fiction_banner"></div>
			{% for f in newfictions %}
				<a href="fiction/{{f.title}}"><strong>{{f.title}}</a></strong> By-<a href="profile/{{f.of.username}}"><strong>{{f.of.username}}</strong></a><br>{{f.abstract}}<br>
			{% endfor %}
            </div>
          </div>
          <div id="new_illustration">
              <div id="new_illustration_banner"></div>
		  {% for f in ill %}
		  <br>
		  <a href="illustration/{{f.title}}"> <img src="{{f.path}}" alt="{{f.title}}" style="height:100px;width:135px"/><strong>{{f.title}}</strong> By-<a href="profile/{{f.of.username}}"><strong>{{f.of.username}}</strong></a><br>
		  {% endfor %}
          </div>
        </div>
		 <div id="new_clan">
         <div id="new_clan_banner"></div>
		{% for f in clans %}
        <div id="small_block">
					<a href="clan/{{f.clanName}}"> <img src="clanpics/{{f.clanName}}.jpg" alt="{{f.clanName}}'s Profile" style="height:100px;width:135px"/><br>{{f.clanName}} </a>
		</div>
		{% endfor %}
		</div><br>
        <div id="announcement"> <div id="announcement_banner"></div>

          <p>Join Us on Facebook <img src="../../../background/facebook_logo.jpg" width="40" height="40" />  Join Us on Twitter<img src="../../../background/Twitter_logo.jpg" width="40" height="40" /></p>

</div>
      </div>
    </div>
    </div>
    <div id="footer_container">
    </div>
  </div>
</div>
</body>
</html>

